<extend name="Layout/ins_base" />
<block name="content">
	<style>
		body {
			background: #f0f0f0;
			height: 100%;
		}
		.login-box {
			position: relative;
			background: #fff;
			width: 760px;
			height: 575px;
			margin-top: 10%;
			margin-left: auto;
			margin-right: auto;
			border: 1px solid #ddd;
		}
		.login-box h1 {
			font-size: 36px;
			text-align: center;
			padding-top: 50px;
			padding-bottom: 30px;
			color: #3d3d3d !important;
		}
		.layui-form {
			width: 400px;
			margin-left: auto;
			margin-right: auto;
		}
		.layui-input {
			height: 48px;
			margin-top: 30px;
		}
		.verify_code {
			text-align: center;
		}
		.verify_code img {
			padding-top: 10px;
		}
		.layui-btn {
			margin-top: 30px;
			width: 100%;
			background: #2794eb;
		}
		.copright {
			position: fixed;
			right: 15px;
			bottom: 0px;
			color: #4E5465;
			text-align: right;
			padding-left: 15px;
			padding-bottom: 15px;
		}
		/* 适配多设备 */
		@media screen and (max-width: 768px) {
			body, html {
				height: 100%;
			}
			.login-box {
				margin-top: 0px;
				width: 100%;
				height: 100%;
				margin: 0px;
				padding: 0px;
				border: 0px;
			}
			.layui-form {
				width: 280px;
			}
		}
	</style>
	<div class="login-box">
		<h1 class="text-center">{:get_system_config("system_name")}</h1>
		<form method="post" id="form_login"  action="{:U('public/check_login')}" class="layui-form">
			<div class="emp_no">
				<input type="text" class="layui-input" id="emp_no" name="emp_no" placeholder="帐号" check="required" info="请输入帐号" />
			</div>
			<div class="password">
				<input class="layui-input" id="password" type="password" name="password" placeholder="密码" info="required" info="请输入密码"/>
			</div>
			<div class="verify_code">
				<notempty name="is_verify_code">
					<input type="text" class="layui-input " id="verify" name="verify" placeholder="验证码"/>
					<img src="{:U('verify')}" style='cursor:pointer' title='刷新验证码' id='verify_img' onclick='freshVerify()'>
				</notempty>
				<div class="layui-form-item hidden">
					<span class="col-sm-3  layui-form-label"> </span>
					<div class="col-sm-9">
						<label class="inline pull-left col-3">
							<input type="checkbox" name="remember" value="1" />
							<span class="lbl"> </span> </label>
						<label for="remember-me">记住我的登录状态</label>
					</div>
				</div>
			</div>
			<div class="login">
				<a lay-submit lay-filter="*"  class="layui-btn layui-btn-del" id="login_btn">登录</a>
			</div>
			<!-- 开源版不允许删除版权链接 谢谢支持  -->
		</form>
		<div class="copright">
			版权所有：<a href="http://www.smeoa.com">小微OA</a>
		</div>
	</div>
</block>
<block name="js">
	<script type="text/javascript">
		//一般直接写在一个js文件中
		layui.use('form', function() {
			var $ = layui.jquery;
			var layer = layui.layer;

			$('#verify_img').on('click', function() {
				$('#verify_img').attr("src", $('#verify_img').attr("src") + "&1" + Math.random());
			});

			var dom = "#password";
			if ($("#verify").length) {
				dom = "#verify";
			}

			$('#login_btn').on('click', function() {
				check_form('form_login', function(ret) {
					if (ret.status == 1) {
						$('#form_login').submit();
					} else {
						layer.msg(ret.info);
						ret.dom.focus();
						return false;
					}
				});
			});

			$(dom).keydown(function(event) {
				if (event.keyCode == 13) {
					check_form('form_login', function(ret) {
						if (ret.status == 1) {
							$('#form_login').submit();
						} else {
							layer.msg(ret.info);
							ret.dom.focus();
							return false;
						}
					});
				}
			});
		});
	</script>
</block>
